<template>
	<view>
			<view>
				<view style="width: 750rpx; height: 1000rpx; background-color: pink;" >
					<text @click="go">
						张铭
					</text>
					<text class="">
						难
					</text>
					<text class="">
						电话
					</text>
					<text class="">
						卡号
					</text>
				</view>
				<view style="width: 750rpx; background-color: skyblue; text-align: center;">
					<view style="height: 260rpx;">
						<br>
						<view style="margin-left: 10rpx; margin-top: 10rpx;" class="avatar-container">
							<image :src="src" style="border-radius: 50%; width: 150rpx; height: 150rpx;"></image>
							<text style="margin-left: 20rpx;" v-model="id">用户名</text>
						</view>
						
					</view>
					<view class="content">
						<u-read-more showHeight="250rpx" :toggle="isshow" closeText="展开" @open="open" @close="close" ref="uReadMore">
							<!-- <view class="" style="width: 750rpx; word-wrap:break-word; background-color: black; color: white;">
							</view> -->
							<u-parse :content="iscontent" @load="load"></u-parse>
						</u-read-more>
					</view>
				</view><br>
				<view style="width: 750rpx;">
					555
				</view><br>
				<view class="checkboxnow"><!-- :rules="rules" -->
					<!-- <u--form labelPosition="left" :model="form"  ref="uForm" labelWidth=75>
						<u-form-item label="是否发热(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="是否咳嗽(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="是否怕冷(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="是否出汗(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="是否疼痛(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="胃口好坏(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="睡眠好坏(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="大便频率(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="大便质地(必填)：" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
						<u-form-item label="检药类型" prop="medicine" borderBottom ref="item1">
							<u-radio-group v-model="form.medicine" placement="row" @change="groupChange">
							    <u-radio :customStyle="{marginBottom: '8px'}" v-for="(i, index) in selecttype" :key="index" :label="i.name" :name="i.name" @change="radioChange(i)" style="margin-left: 75rpx;"></u-radio>
							  </u-radio-group>
						</u-form-item>
					</u--form> -->
					
					
					<text style="text-align: center;">是否发热(必填)：</text>
					<uni-data-checkbox v-model="list[0].label" :localdata="range.one" @change="change"></uni-data-checkbox>
					<text>是否出汗(必填)：</text>
					<uni-data-checkbox v-model="list[1].label" :localdata="range.two" @change="change"></uni-data-checkbox>
					<text>是否怕冷(必填)：</text>
					<uni-data-checkbox v-model="list[2].label" :localdata="range.three" @change="change"></uni-data-checkbox>
					<text>是否咳嗽(必填)：</text>
					<uni-data-checkbox v-model="list[3].label" :localdata="range.four" @change="change"></uni-data-checkbox>
					<text>是否疼痛(必填)：</text>
					<uni-data-checkbox v-model="list[4].label" :localdata="range.five" @change="change"></uni-data-checkbox>
					<text>胃口好坏(必填)：</text>
					<uni-data-checkbox v-model="list[5].label" :localdata="range.six" @change="change"></uni-data-checkbox>
					<text>睡眠好坏(必填)：</text>
					<uni-data-checkbox v-model="list[6].label" :localdata="range.seven" @change="change"></uni-data-checkbox>
					<text>大便频率(必填)：</text>
					<uni-data-checkbox v-model="list[7].label" :localdata="range.eight" @change="change"></uni-data-checkbox>
					<text>大便质地(必填)：</text>
					<uni-data-checkbox v-model="list[8].label" :localdata="range.night" @change="change"></uni-data-checkbox>
					<text>是否晕夫(必填)：</text>
					<uni-data-checkbox v-model="list[9].label" :localdata="range.ele" @change="change"></uni-data-checkbox>
					<text>检药类型(必填)：</text>
					<uni-data-checkbox v-model="list[10].label" :localdata="range.ten" @change="change"></uni-data-checkbox>
					<text>细节描述(选填)：</text>
					<view>
						<textarea name="" cols="30" rows="10" v-model="content" style="border: 1px solid skyblue;" placeholder="进行细节描述"></textarea>
					</view>
				</view>
			</view>
		<view style="width: 750rpx; height: 500rpx;"></view>
		<view class="btn">
			<u-button @click="sub">提交</u-button>
		</view>
	</view>
</template>
<script>
	export default {
		data() { 
			return {
				content:'',
				iscontent:'',
				isshow:true,
				form:{
					name:'1',
					card_id:'1',
					phone:'1',
					medicine:'',
					tname:'1',
					address:'1',
					fulladdress:'1',
					url:''
				},
				medicine:null,
				id:'666',
				src:'../../static/logo.png',
				height:'auto',
				isshow:true,
				list:[
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					},
					{
						label:0
					}
				],
				// value: 1,
				// range: [{"value": 0,"text": "篮球"	},{"value": 1,"text": "足球"},{"value": 2,"text": "游泳"}]
				// content:'',
				selecttype:[
					{
						name:'免煎颗粒',
						lable:1
					},
					{
						name:'中药饮片',
						lable:2
					}
				],
				range:{
					one:[{"value": 0,"text": "是"},{"value": 1,"text": "否"}],
					two:[{"value": 0,"text": "是"},{"value": 1,"text": "否"}],
					three:[{"value": 0,"text": "是"},{"value": 1,"text": "否"}],
					four:[{"value": 0,"text": "是"},{"value": 1,"text": "否"}],
					five:[{"value": 0,"text": "是"},{"value": 1,"text": "否"}],
					six:[{"value": 0,"text": "好"},{"value": 1,"text": "比较好"},{"value": 2,"text": "不好"}],
					seven:[{"value": 0,"text": "好"},{"value": 1,"text": "比较好"},{"value": 2,"text": "差"}],
					eight:[{"value": 0,"text": "1-2次/天"},{"value": 1,"text": "3-4次/天"},{"value": 2,"text": "更多"}],
					night:[{"value": 0,"text": "干"},{"value": 1,"text": "正常"},{"value": 2,"text": "稀"}],
					ten:[{"value": 0,"text": "免煎颗粒"},{"value": 1,"text": "水煮"}],
					ele:[{"value": 0,"text": "是"},{"value": 1,"text": "否"}]
				}
			}
		},
		methods: {
			load() {
			    this.$refs.uReadMore.init();
			},
			groupChange(e) {
				
				console.log(e)
				// this.form.medicine = e.name
			},
			radioChange(e) {
				console.log(e)
				this.form.medicine = e.name
				this.medicine = e.lable
			},
			init(e) {
				console.log(e)
			},
			open(e) {
				console.log(e)
				console.log(this.height)
			},
			change(e){
				console.log(e)
				console.log(this.list)
			},
			close(e) {
				console.log(e)
				// this.$refs.readMore.init();
				// console.log(this.$refs.readMore.init())
			},
			sub() {
				console.log(this.list)
				console.log(this.list.length)
				// console.log(this.content)
			},
			go(){
				uni.request({
					url:'http://124.223.168.50:8000/booking/online_visitpost/',
					method:'POST',
					data:{
						name:'1',
						money:123,
						Doctor_Information:'123',
						Description_condition:'123',
						reply: 'datareply',
						open_id: 'data[open_id]',
						list:this.list,
						// open_id:'123'
					},
					success: (res) => {
						console.log(res)
					}
				})
			}
		}
	}
</script>
<style scoped>
	.avatar-container {
	  display: flex;
	  justify-content: center;
	  align-items: center;
	}
	.photo,
	.content {
		/* float: left; */
	}
	.photo {
		width: 250rpx;
		height: 250rpx;
		text-align: center;
		margin: auto;
		background-color: pink;
	}
	.content {
		width: 750rpx;
		/* height: 250rpx; */
/* 		margin-left: 250rpx;
		margin-top: -250rpx; */
		text-align: center;
		background-color: skyblue;
	}
	.checkboxnow {
		width: 80%;
		margin: auto;
		/* height: 750px; */
		/* text-align: center; */
		/* background-color: darkgrey; */
	}
	.btn {
		position: fixed;
		bottom: 0rpx;
		width: 750rpx;
	}
</style>
